<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <title>
        时之世的世界
    </title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="author" content="shizhishi">
    <meta name="description"
        content="The World of Time is the legendary god in charge of time, who, together with the god in charge of space, the Void Realm, created a vast world">
    <meta name="keywords" content="The World of Time">
    <!--<meta http-equiv="refresh" content="60">-->
    <!--<script type="text/javascript">
        window.alert('欢迎来到世界的真实之地')
    </script>-->

    <style>
        @font-face {
            font-family: luoli;
            src: url('font/萝莉体.ttf');
        }

        * {
            font-family: luoli;
        }

        .click_to_top {
            background-color: rgba(255, 255, 255, 0.568);
            width: 50px;
            height: 50px;
            top: 450px;
            right: 20px;
            position: fixed;
            background-image: url('img/Up向上.svg');
            border-radius: 100%;
            background-size: 50px 50px;
        }

        .click_to_close {
            background-color: white;
            width: 50px;
            height: 50px;
            top: 350px;
            right: 20px;
            position: fixed;
            background-image: url('img/樱花.svg');
            border-radius: 100%;
            background-size: 50px 50px;
        }

        @keyframes rotate {
            0% {
                transform: rotateZ(0deg);
            }

            100% {
                transform: rotateZ(360deg);
            }
        }

        .click_to_music {
            background-color: white;
            width: 50px;
            height: 50px;
            top: 250px;
            right: 20px;
            border-radius: 100%;
            position: fixed;
            animation-timing-function: linear;
            background-image: url('img/音乐.svg');
            background-size: 50px 50px;
            animation-name: rotate;
            animation-duration: 4s;
            /* 延迟2秒 */
            animation-iteration-count: infinite;
            /* 无限循环 */
        }

        a {
            text-decoration: none;
        }

        a:active {
            color: rgb(23, 159, 238);
        }

        a:visited {
            color: rgb(23, 159, 238);
        }

        a:hover {
            color: rgb(23, 159, 238);
        }

        a:first {
            color: rgb(23, 159, 238);
        }

        .click_to_com a {
            color: rgb(23, 159, 238);
        }

        .modal {
            position: fixed;
            z-index: 9999;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.5);
        }

        .modal-content {
            background-color: #61d8ff;
            padding: 20px;
            height: auto;
            width: 300px;
            margin: 0px auto;
            position: absolute;
            top: 300px;
            left: 500px;
        }

        .line_div {
            width: 1300px;
            height: 360px;
            margin: 0px auto;
            text-align: center;
        }

        .click_to_chocolate {
            background-image: url(https://hikarifield.co.jp/koichoco/images/koichoco-logo.png);
            position: absolute;
            left: 390px;
            top: 26px;
            width: 950px;
            height: 80px;
            background-repeat: no-repeat;
        }

        .click_to_sprite {
            background-image: url('img/sprite.svg');
            background-position: center;
            position: absolute;
            left: 20px;
            top: 0px;
            width: 300px;
            height: 106px;
            background-repeat: no-repeat;
        }

        .span_img_div {
            display: inline-block;
            margin-inline: 0px;
            margin-block: 0px;
            height: 340px;
            width: 600px;
        }

        .span_img_div:hover {
            position: relative;
            transform: scale(1.1);
            z-index: 1;
            border-radius: 15px;
            box-shadow: 0 0 0 50vmax rgba(0, 0, 0, .5);
        }

        .click_to_com {
            text-decoration: none;
            text-decoration: none;
            padding: unset;
            background-color: unset;
            border-width: inherit;
        }

        .click_photo {
            border-radius: 15px;
            width: 600px;
            height: 340px;
        }

        .title_span {
            position: relative;
            top: -94px;
            text-align: center;
            margin: 0 atuo;
        }

        .title {
            display: inline-block;
            width: 600px;
            height: 90px;
            font-size: 40px;
            margin-inline: 0px;
            margin-block: 0px;
            background-color: aliceblue;
            opacity: 0.98;
            border-radius: 0px 0px 20px 20px;
        }

        .div_introduction {
            position: relative;
            width: 100%;
            height: 550px;
            padding: 20px 0;
        }

        .div_tip {
            width: 65%;
            text-align: left;
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin: 10px auto 20px auto;
        }

        .div_tip_img_left_a {
            position: absolute;
            left: 130px;
            top: 10px;
            width: 79px;
            height: 55px;
        }

        .div_tip_img_left_b {
            position: absolute;
            left: 480px;
            top: 10px;
            width: 79px;
            height: 55px;
        }

        .div_tip_img_right_a {
            position: absolute;
            left: 390px;
            top: 10px;
            width: 80px;
            height: 53px;
        }

        .div_tip_img_right_b {
            position: absolute;
            left: 730px;
            top: 10px;
            width: 80px;
            height: 53px;
        }

        .div_sec {
            height: 550px;
            vertical-align: top;
            width: 45%;
            overflow: hidden;
            margin-bottom: 20px;
            position: relative;
            transition: all .2s;
        }
        .div_sec:hover {
            position: relative;
            transform: scale(1.1);
            background-color: rgba(255, 255, 255, 0.8);
            z-index: 1;
            border-radius: 10px;
            box-shadow: 0 0 0 50vmax rgba(0, 0, 0, .5);
        }

        #other_com a {
            color: rgb(158, 45, 4);
        }
    </style>
    <link href=".\css\css_background.css" rel="stylesheet">
    <link href=".\css\css_video.css" rel="stylesheet">
    <link href=".\css\css_text.css" rel="stylesheet">
    <link href=".\css\css_start.css" rel="stylesheet">
    <link href=".\css\css_information.css" rel="stylesheet">
</head>

<body>
    <!--樱花动画-->
    <canvas id="canvas_sakura" height="793" width="1408"
        style=" position: fixed;left: 0;top: 0;pointer-events: none;z-index:99999;"></canvas>
    <!--顶部按钮-->
    <a class="click_to_top" href="#"></a>
    <!--关闭动画按钮-->
    <a class="click_to_close" onclick="stopp()"></a>
    <!--音乐按钮-->
    <a class="click_to_music" onclick="music_change()">
        <audio src="audio/动漫主题曲.mp3" loop></audio>
    </a>
    <!--实现点击a来暂停和播放音乐-->
    <script>
        var audio = document.getElementsByTagName("audio")[0];
        var btn = document.querySelector(".click_to_music");
        btn.onclick = function () {
            audio.paused ? audio.play() : audio.pause();
        }
    </script>
    <!--头部-->
    <div id="start">
        <div>
            <h1>
                <br>
                <a class="click_to_sprite" target="_blank" title="sprite社" href="https://sprite.net/">
                </a>
                <a class="click_to_chocolate" title="恋爱选举巧克力" href="https://hikarifield.co.jp/koichoco/index.html">
                </a>
                </br>
            </h1>
        </div>
    </div>

    <!--切换主界面按钮-->
    <div id="model" style="margin: 0 auto;text-align: center; height: 33px;">
        <div id="Mv" style=" display: none;">
            <button onclick="change_mv_model()"
                style="background-color: #61d8ff;width: 90px;border-style: none;border-top-right-radius:10px;border-top-left-radius:10px; height: 20px;">
                Mv
            </button>
        </div>
        <div id="Mv_ch" style=" display:inline-block;position: relative;
        bottom: 12px;">
            <button onclick="change_mv_model()"
                style="background-color: #61d8ff;width: 90px;border-style: none;border-top-right-radius:10px;border-top-left-radius:10px; height: 45px;">
                Mv
            </button>
        </div>
        <div id="Story" style=" display: inline-block;">
            <button onclick="change_story_model()"
                style="background-color: #61d8ff;width: 90px;border-style: none;border-top-right-radius:10px;border-top-left-radius:10px; height: 20px;">
                Story
            </button>
        </div>
        <div id="Story_ch" style=" display: none;position: relative;
        bottom: 12px;">
            <button onclick="change_story_model()"
                style="background-color: #61d8ff;width: 90px;border-style: none;border-top-right-radius:10px;border-top-left-radius:10px; height: 45px;">
                Story
            </button>
        </div>
        <div id="Characters" style=" display: inline-block;">
            <button onclick="change_characters_model()"
                style="background-color: #61d8ff;width: 90px;border-style: none;border-top-right-radius:10px;border-top-left-radius:10px; height: 20px;">
                Characters
            </button>
        </div>
        <div id="Characters_ch" style="display: none;position: relative;
        bottom: 12px;">
            <button onclick="change_characters_model()"
                style="background-color: #61d8ff;width: 90px;border-style: none;border-top-right-radius:10px;border-top-left-radius:10px; height: 45px;">
                Characters
            </button>
        </div>
        <div id="Download" style=" display: inline-block;">
            <button onclick="change_download_model()"
                style="background-color: #61d8ff;width:90px;border-style: none;border-top-right-radius:10px;border-top-left-radius:10px; height: 20px;">
                Download
            </button>
        </div>
        <div id="Download_ch" style="display: none;position: relative;
        bottom: 12px;">
            <button onclick="change_download_model()"
                style="background-color: #61d8ff;width:90px;border-style: none;border-top-right-radius:10px;border-top-left-radius:10px; height: 45px;">
                Download
            </button>
        </div>
    </div>
    <!--mv-->
    <div id="mv"
        style="text-align: center; margin: 0 auto;display:block;width: 1000px;height: 562.5px;overflow: hidden;">
        <video crossorigin="anonymous" preload="auto" controls autoplay loop src="video/sprite.mp4"
            poster="img/Koi_to_senkyo_to_chocolate.jpg" style="width: 1000px;">
        </video>
    </div>
    <!--story-->
    <div id="story" class="information" style="display: none;">
        <h1 style="display: contents;"><img style="margin-top: 30px;left: 40px;position: relative;"
                src="https://hikarifield.co.jp/koichoco/images/Title-Story.jpg" alt="Story"></h1>
        <h2 style="color: rgb(98, 60, 1); font-size: 50px; margin-block-end: 20px;margin-top: 0px;padding-top: 20px;">
            <b>恋爱选举巧克力</b>
        </h2>

        <p>
            <span>
                <ul class="text">
                    <img style="margin-top: 30px;left: -35px;position: relative;" src="img\恋爱选举top_Image_hr.png"
                        alt="story_img">
                    <li>
                        《恋爱与选举与巧克力》（日语：恋と选挙とチョコレート）是Sprite制作的一款恋爱冒险游戏，于2010年10月29日在日本本土发售。美少女游戏品牌sprite的处女作。2012年9月27日，角川游戏代理发行PSP版《恋爱与选举与巧克力：携带版》（原名：恋と选挙とチョコレート
                        ポータブル）
                    </li>
                    <li>
                        本作讲述了大岛裕树和青梅竹马住吉千里为了拯救“食品研究部”而行动起来，阻止东云皐月的废部推行的故事。
                    </li>
                    <li>
                        2011年1月刊《电击G's magazine》上宣布动画化，2012年7月至9月放送12集电视动画。其他衍生作品包括两部漫画《恋爱与选举与巧克力》《恋爱与选举与巧克力
                        SLC》各六册，轻小说《恋爱与选举与巧克力 a novel》一本。
                    </li>
                </ul>
            </span>
        </p>
    </div>
    <!--characters-->
    <div id="characters" class="information" style="text-align: center; margin: 0 auto;display:none;">
        <h1 style="display: contents;"><img style="margin-top: 30px;left: 40px;position: relative;"
                src="https://hikarifield.co.jp/koichoco/images/Title-Character.jpg" alt="Characters"></h1>
        <h2 style="font-size: 45px; margin-top: 0px; padding-top: 20px;">
            角色介绍
        </h2>
        <div>
            <img src="img/Characters_a.png" alt="character_relationship" style="width: 760px;">
        </div>
        <div class="div_introduction" style="margin-top:30px;">
            <div class="div_tip">
                <section class="div_sec">
                    <dl>
                        <dt><img style="width:100%;"
                                src="https://hikarifield.co.jp/koichoco/images/character/chisato_face.jpg" alt="住吉千里">
                        </dt>
                        <dd style="width:100%; margin: 0 auto;">
                            <h3 style="text-align:center;font-weight:bold;font-size:1.5em;margin:15px 0;">住吉千里
                            </h3>
                            <p style="font-size:1em;line-height:1.5em;">高藤学园二年级学生，升学科。<br>
                                食品研究社社长。在前任社长希美的指名下就任社长。<br>
                                学习成绩优秀，在班级里名列前茅，在整个升学科里都首屈一指。体育也样样擅长，反应力拔群。</p>
                        </dd>
                    </dl>
                </section><img class="div_tip_img_left_a"
                    src="https://hikarifield.co.jp/koichoco/images/character//tape-L.png"><img
                    class="div_tip_img_right_a" src="https://hikarifield.co.jp/koichoco/images/character//tape-R.png">
                <section class="div_sec">
                    <dl>
                        <dt><img style="width:100%;"
                                src="https://hikarifield.co.jp/koichoco/images/character/isara_face.jpg" alt="青海衣更">
                        </dt>
                        <dd style="width:100%;margin: 0 auto;">
                            <h3 style="text-align:center;font-weight:bold;font-size:1.5em;margin:15px 0;">青海衣更
                            </h3>
                            <p style="font-size:1em;line-height:1.5em;">高藤学园一年级学生，是经济特待生（免费生）。<br>
                                身为特待生，她常常遭遇毫无理由的歧视，但她都不放在心上。</p>
                        </dd>
                    </dl>
                </section><img class="div_tip_img_left_b"
                    src="https://hikarifield.co.jp/koichoco/images/character//tape-L.png"><img
                    class="div_tip_img_right_b" src="https://hikarifield.co.jp/koichoco/images/character//tape-R.png">
            </div>
        </div>
        <div class="div_introduction">
            <div class="div_tip">
                <section class="div_sec">
                    <dl>
                        <dt><img style="width:100%;"
                                src="	https://hikarifield.co.jp/koichoco/images/character/michiru_face.jpg" alt="森下未散">
                        </dt>
                        <dd style="width:100%;margin: 0 auto;">
                            <h3 style="text-align:center;font-weight:bold;font-size:1.5em;margin:15px 0;">森下未散
                            </h3>
                            <p style="font-size:1em;line-height:1.5em;">高藤学园一年级学生。<br>
                                老家在首都外，所以她住在宿舍里生活。<br>
                                因为好吃棒很美味而在初选时加入了食品研究社。之后她就在社团室里一心一意地吃着好吃棒。</p>
                        </dd>
                    </dl>
                </section><img class="div_tip_img_left_a"
                    src="https://hikarifield.co.jp/koichoco/images/character//tape-L.png"><img
                    class="div_tip_img_right_a" src="https://hikarifield.co.jp/koichoco/images/character//tape-R.png">
                <section class="div_sec">
                    <dl>
                        <dt><img style="width:100%;"
                                src="https://hikarifield.co.jp/koichoco/images/character/satsuki_face.jpg" alt="东云皋月">
                        </dt>
                        <dd style="width:100%;margin: 0 auto;">
                            <h3 style="text-align:center;font-weight:bold;font-size:1.5em;margin:15px 0;">东云皋月
                            </h3>
                            <p style="font-size:1em;line-height:1.5em;">高藤学园二年级学生。<br>
                                自治学生会财务部的财务部长。<br>
                                一年级时在财务部的管理部门达成了往年最高的资产管理成绩，被提拔为财务部长。<br>
                                按照行政3部长参选学生会长的惯例，预计她将竞选下一任自治学生会长。</p>
                        </dd>
                    </dl>
                </section><img class="div_tip_img_left_b"
                    src="https://hikarifield.co.jp/koichoco/images/character//tape-L.png"><img
                    class="div_tip_img_right_b" src="https://hikarifield.co.jp/koichoco/images/character//tape-R.png">
            </div>
        </div>
        <div class="div_introduction">
            <div class="div_tip">
                <section class="div_sec">
                    <dl>
                        <dt><img style="width:100%;"
                                src="https://hikarifield.co.jp/koichoco/images/character/mifuyu_face.jpg" alt="木场美冬">
                        </dt>
                        <dd style="width:100%;margin: 0 auto;">
                            <h3 style="text-align:center;font-weight:bold;font-size:1.5em;margin:15px 0;">木场美冬
                            </h3>
                            <p style="font-size:1em;line-height:1.5em;">高藤学园二年级学生，升学科。<br>
                                因为在之前的学校里长期住院，所以留级了一年。<br>
                                刚刚重返课堂的时候，她因为不适应班级而差点被孤立。所幸有千里主动地找她聊天，她才得以与同学们打破隔阂。</p>
                        </dd>
                    </dl>
                </section><img class="div_tip_img_left_a"
                    src="https://hikarifield.co.jp/koichoco/images/character//tape-L.png"><img
                    class="div_tip_img_right_a" src="https://hikarifield.co.jp/koichoco/images/character//tape-R.png">
                <section class="div_sec">
                    <dl>
                        <dt><img style="width:100%;"
                                src="https://hikarifield.co.jp/koichoco/images/character/yuhki_face.jpg" alt="大岛裕树">
                        </dt>
                        <dd style="width:100%;margin: 0 auto;">
                            <h3 style="text-align:center;font-weight:bold;font-size:1.5em;margin:15px 0;">大岛裕树
                            </h3>
                            <p style="font-size:1em;line-height:1.5em;">学园二年级，升学科。<br>
                                名义上属于食品研究社（浑然不知下被千里强迫加入的）。<br>
                                学习成绩一般。体育水平还可以，但也不突出。</p>
                        </dd>
                    </dl>
                </section><img class="div_tip_img_left_b"
                    src="https://hikarifield.co.jp/koichoco/images/character//tape-L.png"><img
                    class="div_tip_img_right_b" src="https://hikarifield.co.jp/koichoco/images/character//tape-R.png">
            </div>
        </div>
        <div class="div_introduction">
            <div class="div_tip">
                <section class="div_sec">
                    <dl>
                        <dt><img style="width:100%;"
                                src="https://hikarifield.co.jp/koichoco/images/character/nozomi_face.jpg" alt="枝川希美">
                        </dt>
                        <dd style="width:100%;margin: 0 auto;">
                            <h3 style="text-align:center;font-weight:bold;font-size:1.5em;margin:15px 0;">枝川希美
                            </h3>
                            <p style="font-size:1em;line-height:1.5em;">高藤学园三年级，升学科。<br>
                                食研的前任社长。<br>
                                名义上已经引退，但依然天天都会来社团室。<br>
                                是在国外跳级后回到日本的归国女孩。</p>
                        </dd>
                    </dl>
                </section><img class="div_tip_img_left_a"
                    src="https://hikarifield.co.jp/koichoco/images/character//tape-L.png"><img
                    class="div_tip_img_right_a" src="https://hikarifield.co.jp/koichoco/images/character//tape-R.png">
                <section class="div_sec">
                    <dl>
                        <dt><img style="width:100%;"
                                src="https://hikarifield.co.jp/koichoco/images/character/oboro_face.jpg" alt="梦岛 胧">
                        </dt>
                        <dd style="width:100%;margin: 0 auto;">
                            <h3 style="text-align:center;font-weight:bold;font-size:1.5em;margin:15px 0;">梦岛 胧
                            </h3>
                            <p style="font-size:1em;line-height:1.5em;">高藤学园一年级。<br>
                                是食研的成员，也是现在的副社长。<br>
                                入学时被知道其身份的希美挖角进了社团。</p>
                        </dd>
                    </dl>
                </section><img class="div_tip_img_left_b"
                    src="https://hikarifield.co.jp/koichoco/images/character//tape-L.png"><img
                    class="div_tip_img_right_b" src="https://hikarifield.co.jp/koichoco/images/character//tape-R.png">
            </div>
        </div>
        <div class="div_introduction">
            <div class="div_tip">
                <section class="div_sec">
                    <dl>
                        <dt><img style="width:100%;"
                                src="https://hikarifield.co.jp/koichoco/images/character/hazuki_face.jpg" alt="东云叶月">
                        </dt>
                        <dd style="width:100%;margin: 0 auto;">
                            <h3 style="text-align:center;font-weight:bold;font-size:1.5em;margin:15px 0;">东云叶月
                            </h3>
                            <p style="font-size:1em;line-height:1.5em;">高藤学园的教师，23岁，今年是任职的第二年。同时也是高藤的毕业生。<br>
                                她是食品研究社的顾问，总是在社团室里借着点心下酒。社团室里的啤酒机也是叶月设置的。</p>
                        </dd>
                    </dl>
                </section><img class="div_tip_img_left_a"
                    src="https://hikarifield.co.jp/koichoco/images/character//tape-L.png"><img
                    class="div_tip_img_right_a" src="https://hikarifield.co.jp/koichoco/images/character//tape-R.png">
                <section class="div_sec">
                    <dl>
                        <dt><img style="width:100%;"
                                src="https://hikarifield.co.jp/koichoco/images/character/kii_face.jpg" alt="门前仲绮衣"></dt>
                        <dd style="width:100%;margin: 0 auto;">
                            <h3 style="text-align:center;font-weight:bold;font-size:1.5em;margin:15px 0;">门前仲绮衣
                            </h3>
                            <p style="font-size:1em;line-height:1.5em;">高藤学园二年级，升学科。与拍档的爱同班。<br>
                                食研的普通成员。<br>
                                总是和青梅竹马的爱一起行动。<br>
                                家里经营鱼铺，卖不掉的商品总会端上餐桌，令她成了讨厌鱼的人。</p>
                        </dd>
                    </dl>
                </section><img class="div_tip_img_left_b"
                    src="https://hikarifield.co.jp/koichoco/images/character//tape-L.png"><img
                    class="div_tip_img_right_b" src="https://hikarifield.co.jp/koichoco/images/character//tape-R.png">
            </div>
        </div>
        <div class="div_introduction">
            <div class="div_tip">
                <section class="div_sec">
                    <dl>
                        <dt><img style="width:100%;"
                                src="https://hikarifield.co.jp/koichoco/images/character/ai_face.jpg" alt="猿江 爱"></dt>
                        <dd style="width:100%;margin: 0 auto;">
                            <h3 style="text-align:center;font-weight:bold;font-size:1.5em;margin:15px 0;">猿江 爱
                            </h3>
                            <p style="font-size:1em;line-height:1.5em;">高藤学园二年级，升学科。与拍档的绮衣同班。<br>
                                食研的普通成员。<br>
                                总是和青梅竹马的绮衣一同行动。<br>
                                家里经营蔬菜店，卖不掉的商品总会端上餐桌，令她成了讨厌蔬菜的人。</p>
                        </dd>
                    </dl>
                </section><img class="div_tip_img_left_a"
                    src="https://hikarifield.co.jp/koichoco/images/character//tape-L.png"><img
                    class="div_tip_img_right_a" src="https://hikarifield.co.jp/koichoco/images/character//tape-R.png">
                <section class="div_sec">
                    <dl>
                        <dt><img style="width:100%;"
                                src="https://hikarifield.co.jp/koichoco/images/character/yakumo_face.jpg" alt="毛利 夜云">
                        </dt>
                        <dd style="width:100%;margin: 0 auto;">
                            <h3 style="text-align:center;font-weight:bold;font-size:1.5em;margin:15px 0;">毛利 夜云
                            </h3>
                            <p style="font-size:1em;line-height:1.5em;">高藤学园三年级，升学科。<br>
                                现任自治学生会长。<br>
                                出身治安部，也是治安部派系的老大。<br>
                                连续三代治安部政权的传承看不到未来，令他非常头疼。</p>
                        </dd>
                    </dl>
                </section><img class="div_tip_img_left_b"
                    src="https://hikarifield.co.jp/koichoco/images/character//tape-L.png"><img
                    class="div_tip_img_right_b" src="https://hikarifield.co.jp/koichoco/images/character//tape-R.png">
            </div>
        </div>
        <div class="div_introduction">
            <div class="div_tip">
                <section class="div_sec">
                    <dl>
                        <dt><img style="width:100%;"
                                src="https://hikarifield.co.jp/koichoco/images/character/moheiji_face.jpg" alt="辰巳茂平治">
                        </dt>
                        <dd style="width:100%;margin: 0 auto;">
                            <h3 style="text-align:center;font-weight:bold;font-size:1.5em;margin:15px 0;">辰巳茂平治
                            </h3>
                            <p style="font-size:1em;line-height:1.5em;">高藤学园二年级，升学科。<br>
                                学生会现任总务部长，总务部派系推举的参选人。<br>
                                支持率上被皋月遥遥领先，为了反败为胜，他设计了许多策略。<br>
                                是个肚量很小的人，但也非常谨慎。</p>
                        </dd>
                    </dl>
                </section><img class="div_tip_img_left_a"
                    src="https://hikarifield.co.jp/koichoco/images/character//tape-L.png"><img
                    class="div_tip_img_right_a" src="https://hikarifield.co.jp/koichoco/images/character//tape-R.png">
                <section class="div_sec">
                    <dl>
                        <dt><img style="width:100%;"
                                src="https://hikarifield.co.jp/koichoco/images/character/reiji_face.jpg" alt="佐贺玲二">
                        </dt>
                        <dd style="width:100%;margin: 0 auto;">
                            <h3 style="text-align:center;font-weight:bold;font-size:1.5em;margin:15px 0;">佐贺玲二
                            </h3>
                            <p style="font-size:1em;line-height:1.5em;">高藤学园二年级，升学科。和裕树同班。<br>
                                加入了惊叹祝祭社，夏天已经升任社长。<br>
                                因为惊叹祝祭社也是皋月承诺中需要整顿的社团之一，所以他选择帮助裕树竞选。</p>
                        </dd>
                    </dl>
                </section><img class="div_tip_img_left_b"
                    src="https://hikarifield.co.jp/koichoco/images/character//tape-L.png"><img
                    class="div_tip_img_right_b" src="https://hikarifield.co.jp/koichoco/images/character//tape-R.png">
            </div>
        </div>
        <div class="div_introduction">
            <div class="div_tip">
                <section class="div_sec">
                    <dl>
                        <dt><img style="width:100%;"
                                src="https://hikarifield.co.jp/koichoco/images/character/mieru_face.jpg" alt="有明美绘瑠">
                        </dt>
                        <dd style="width:100%;margin: 0 auto;">
                            <h3 style="text-align:center;font-weight:bold;font-size:1.5em;margin:15px 0;">有明美绘瑠
                            </h3>
                            <p style="font-size:1em;line-height:1.5em;">高藤学园二年级，升学科。和裕树同班。<br>
                                加入了FNOS，夏天已经升任社长。<br>
                                从里到外都是货真价实的腐女。</p>
                        </dd>
                    </dl>
                </section><img class="div_tip_img_left_a"
                    src="https://hikarifield.co.jp/koichoco/images/character//tape-L.png"><img
                    class="div_tip_img_right_a" src="https://hikarifield.co.jp/koichoco/images/character//tape-R.png">
                <section class="div_sec">
                    <dl>
                        <dt><img style="width:100%;"
                                src="https://hikarifield.co.jp/koichoco/images/character/hidaka_face.jpg" alt="汐浜阳高">
                        </dt>
                        <dd style="width:100%;margin: 0 auto;">
                            <h3 style="text-align:center;font-weight:bold;font-size:1.5em;margin:15px 0;">汐浜阳高
                            </h3>
                            <p style="font-size:1em;line-height:1.5em;">高藤学园二年级，升学科。<br>
                                ASP的记者。<br>
                                有时候身着男生校服，有时候身着女生校服。穿着不同校服的时候，体型看上去也会有些变化，但具体性别不明。</p>
                        </dd>
                    </dl>
                </section><img class="div_tip_img_left_b"
                    src="https://hikarifield.co.jp/koichoco/images/character//tape-L.png"><img
                    class="div_tip_img_right_b" src="https://hikarifield.co.jp/koichoco/images/character//tape-R.png">
            </div>
        </div>
    </div>
    <!--download-->
    <div id="download" style="text-align: center; margin: 0 auto;display: none;">
        <!--第一行-->
        <div class="line_div">
            <!--图片部分-->
            <span>
                <div class="span_img_div" style="position: relative;left:-5px ">
                    <a class="click_to_com" href="https://hikarifield.co.jp/koichoco/index.html" target="_blank ">
                        <img class="click_photo" src="https://hikarifield.co.jp/koichoco/images/eventcg/eventcg01.jpg"
                            alt="官方中文网站" ">
                            </img>
                        </a>
                    </div>
                <div class=" span_img_div" style="position: relative;left:5px ">
                        <a class="click_to_com"
                            href="https://mzh.moegirl.org.cn/%E6%81%8B%E7%88%B1%E4%B8%8E%E9%80%89%E4%B8%BE%E4%B8%8E%E5%B7%A7%E5%85%8B%E5%8A%9B"
                            target="_blank ">
                            <img class="click_photo"
                                src="https://hikarifield.co.jp/koichoco/images/eventcg/eventcg03.jpg" alt="萌娘百科" ">
                        </img>
                    </a>
            </div>
            </span>
            <!--标题部分-->
            <span class=" title_span">
                            <div class="title" style="position: relative;left:-5px ">
                                <a title="click_to_com" href="https://hikarifield.co.jp/koichoco/index.html"
                                    target="_blank">
                                    <div>
                                        恋爱与选举与巧克力中文官网
                                    </div>
                                </a>
                            </div>
                            <div class="title" style="position: relative;left:5px ">
                                <a title="click_to_com"
                                    href="https://mzh.moegirl.org.cn/%E6%81%8B%E7%88%B1%E4%B8%8E%E9%80%89%E4%B8%BE%E4%B8%8E%E5%B7%A7%E5%85%8B%E5%8A%9B"
                                    target="_blank">
                                    <div>
                                        萌娘百科：恋爱与选举与巧克力
                                    </div>
                                </a>
                            </div>
            </span>
        </div>
        <!--第二行-->
        <div class="line_div">
            <!--图片部分-->
            <span>
                <div class="span_img_div" style="position: relative;left:-5px ">
                    <button class="click_to_com" onclick="movie_watch()" target="_blank ">
                        <img class="click_photo" src="https://hikarifield.co.jp/koichoco/images/eventcg/eventcg10.jpg"
                            alt="动漫720p">
                        </img>
                    </button>
                </div>
                <div class=" span_img_div" style="position: relative;left:5px ">
                    <a class="click_to_com" href="https://krkr.xyz/forum-post/11528.html" target="_blank ">
                        <img class="click_photo" src="https://hikarifield.co.jp/koichoco/images/eventcg/eventcg04.jpg"
                            alt="pc硬盘汉化">
                        </img>
                    </a>
                </div>
            </span>
            <!--标题部分-->
            <span class="title_span">
                <div class="title" style="position: relative;left:-5px; ">
                    <button title="click_to_com" onclick="movie_watch()" target="_blank" style="border: none;
                    background-color: unset;
                    font-size: inherit;
                    color: #179FEE;">
                        <div>
                            [动漫720p]恋爱与选举与巧克力
                        </div>
                    </button>
                </div>
                <div class="title" style="position: relative;left:5px ">
                    <a title="click_to_com" href="https://krkr.xyz/forum-post/11528.html" target="_blank">
                        <div>
                            [pc汉化]恋爱与选举与巧克力
                        </div>
                    </a>
                </div>
            </span>
        </div>
    </div>
    <!-- 视频部分 -->
    <div id="movies_watching" style="text-align: center; margin: 0 auto;display:none;">
        <div class="movie">
            <video id="video" src="" width="1000px" height="562.5px" controls="controls" autoplay="autoplay"></video>
        </div>
        <div>
            <button id="play_1" onclick="play_video_1()">第一集</button>
            <button id="play_2" onclick="play_video_2()">第二集</button>
            <button id="play_3" onclick="play_video_3()">第三集</button>
            <button id="play_4" onclick="play_video_4()">第四集</button>
            <button id="play_5" onclick="play_video_5()">第五集</button>
            <button id="play_6" onclick="play_video_6()">第六集</button>
            <button id="play_7" onclick="play_video_7()">第七集</button>
            <button id="play_8" onclick="play_video_8()">第八集</button>
            <button id="play_9" onclick="play_video_9()">第九集</button>
            <button id="play_10" onclick="play_video_10()">第十集</button>
            <button id="play_11" onclick="play_video_11()">第十一集</button>
            <button id="play_12" onclick="play_video_12()">第十二集</button>
            <button id="play_13" onclick="play_video_13()">第十三集</button>
        </div>
    </div>
    <!--外链部分-->
    <hr>
    <div id="other_com" style="background-color: rgba(23, 159, 238, 0.508);">
        <h1>
            gal网站
        </h1>

        <a href="https://shinnku.com/" target="_blank" style="width: 200px;display: inline-block;">失落的小站</a>
        <a href="https://oda.lzacg.one/" target="_blank" style="width: 200px;display: inline-block;">量子ACG</a>
        <a href="https://wus-www.sway-cdn.com/6sWDWAwefaPBooqL" target="_blank"
            style="width: 200px;display: inline-block;">缘之空</a>
        <a href="https://vndb.org/" target="_blank" style="width: 200px;display: inline-block;">the visual novel
            database</a>
        <h1>
            官方网站
        </h1>

        <a title="oldsprite" href="https://old.sprite.net/" target="_blank" style="background-image: url(https://old.sprite.net/shared/images/hd_logo.png);height: 100px;width: 650px;display:inline-block;
        background-repeat: no-repeat;background-size:auto 100px ;">
        </a>
        <a title="sprite" href="https://sprite.net/" target="_blank" style="background-image: url('img/sprite.svg');height: 100px;width: 650px;display: inline-block;
        background-repeat: no-repeat;background-size:auto 100px ;">
        </a>
        <a title="想告诉哥哥我是妹妹" href="https://koichoco.sprite.net/imaimo/" target="_blank" style="background-image: url(https://koichoco.sprite.net/imaimo/img/top/logo_fairys.png);height: 100px;width: 650px;display: inline-block;
        background-repeat: no-repeat;background-size:auto 100px ;">
        </a>
        <a title="苍之彼方的四重奏" href="https://aokana.sprite.net/" target="_blank" style="background-image: url(https://aokana.sprite.net/new_top/aokana_logo.png);height: 100px;width: 650px;display: inline-block;
        background-repeat: no-repeat;background-size:auto 100px ;">
        </a>

    </div>
</body>

</html>
<!--樱花动画-->
<script type="text/javascript">
    var stop, staticx;
    var img = new Image();
    img.src = "";
    function Sakura(x, y, s, r, fn) {
        this.x = x;
        this.y = y;
        this.s = s;
        this.r = r;
        this.fn = fn;
    }
    Sakura.prototype.draw = function (cxt) {
        cxt.save();
        var xc = (40 * this.s) / 4;
        cxt.translate(this.x, this.y);
        cxt.rotate(this.r);
        cxt.drawImage(img, 0, 0, 40 * this.s, 40 * this.s);
        cxt.restore();
    };
    Sakura.prototype.update = function () {
        this.x = this.fn.x(this.x, this.y);
        this.y = this.fn.y(this.y, this.y);
        this.r = this.fn.r(this.r);
        if (this.x > window.innerWidth || this.x < 0 || this.y > window.innerHeight || this.y < 0) {
            this.r = getRandom("fnr");
            if (Math.random() > 0.4) {
                this.x = getRandom("x");
                this.y = 0;
                this.s = getRandom("s");
                this.r = getRandom("r");
            }
            else {
                this.x = window.innerWidth;
                this.y = getRandom("y");
                this.s = getRandom("s");
                this.r = getRandom("r");
            }
        }
    };
    SakuraList = function () {
        this.list = [];
    };
    SakuraList.prototype.push = function (sakura) {
        this.list.push(sakura);
    };
    SakuraList.prototype.update = function () {
        for (var i = 0, len = this.list.length; i < len; i++) {
            this.list[i].update();
        }
    };
    SakuraList.prototype.draw = function (cxt) {
        for (var i = 0, len = this.list.length; i < len; i++) {
            this.list[i].draw(cxt);
        }
    };
    SakuraList.prototype.get = function (i) {
        return this.list[i];
    };
    SakuraList.prototype.size = function () {
        return this.list.length;
    };
    function getRandom(option) {
        var ret, random; switch (option) {
            case "x": ret = Math.random() * window.innerWidth; break;
            case "y": ret = Math.random() * window.innerHeight; break;
            case "s": ret = Math.random(); break; 
            case "r": ret = Math.random() * 6;break;
            case "fnx": random = -0.5 + Math.random() * 1;
                ret = function (x, y) { return x + 0.5 * random - 1.7; };
                break;
            case "fny": random = 1.5 + Math.random() * 0.7;
                ret = function (x, y) { return y + random; };
                break; case "fnr": random = Math.random() * 0.03;
                ret = function (r) { return r + random; };
                break;
        }
        return ret;
    }
    function startSakura() {
        requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame || window.webkitRequestAnimationFrame || window.msRequestAnimationFrame || window.oRequestAnimationFrame;
        var canvas = document.createElement("canvas"), cxt;
        staticx = true;
        canvas.height = window.innerHeight;
        canvas.width = window.innerWidth;
        canvas.setAttribute("style", "position: fixed;left: 0;top: 0;pointer-events: none;z-index:99999;");
        canvas.setAttribute("id", "canvas_sakura");
        document.getElementsByTagName("body")[0].appendChild(canvas);
        cxt = canvas.getContext("2d");
        var sakuraList = new SakuraList();
        for (var i = 0; i < 50; i++) {
            var sakura, randomX, randomY, randomS, randomR, randomFnx, randomFny;
            randomX = getRandom("x");
            randomY = getRandom("y");
            randomR = getRandom("r");
            randomS = getRandom("s");
            randomFnx = getRandom("fnx");
            randomFny = getRandom("fny");
            randomFnR = getRandom("fnr");
            sakura = new Sakura(randomX, randomY, randomS, randomR, { x: randomFnx, y: randomFny, r: randomFnR, }); sakura.draw(cxt);
            sakuraList.push(sakura);
        }
        stop = requestAnimationFrame(function () {
            cxt.clearRect(0, 0, canvas.width, canvas.height);
            sakuraList.update();
            sakuraList.draw(cxt);
            stop = requestAnimationFrame(arguments.callee);
        });
    }
    window.onresize = function () {
        var canvasSnow = document.getElementById("canvas_snow");
    };
    img.onload = function () {
        startSakura();
    };
    function clearCanvas() {
        var canvas = document.getElementById("canvas_sakura");
        if (canvas && canvas.getContext("2d")) {
            canvas.clearRect(0, 0, canvas.width, canvas.height);
        }
    }
    function stopp() {
        if (staticx) {

            var child = document.getElementById("canvas_sakura");
            child.parentNode.removeChild(child);
            window.cancelAnimationFrame(stop); clearCanvas(); staticx = false;
        }
        else {
            startSakura();
        }
    }
</script>
<script>
    function change_mv_model() {
        document.getElementById("mv").style.display = "block";
        document.getElementById("Mv").style.display = "none";
        document.getElementById("Mv_ch").style.display = "inline-block";
        document.getElementById("Characters").style.display = "inline-block";
        document.getElementById("Story").style.display = "inline-block";
        document.getElementById("Download").style.display = "inline-block";
        document.getElementById("Characters_ch").style.display = "none";
        document.getElementById("Story_ch").style.display = "none";
        document.getElementById("Download_ch").style.display = "none";
        document.getElementById("characters").style.display = "none";
        document.getElementById("story").style.display = "none";
        document.getElementById("download").style.display = "none";
        document.getElementById("movies_watching").style.display = "none";
    }
    function change_story_model() {
        document.getElementById("story").style.display = "block";
        document.getElementById("Story").style.display = "none";
        document.getElementById("Story_ch").style.display = "inline-block";
        document.getElementById("Characters").style.display = "inline-block";
        document.getElementById("Mv").style.display = "inline-block";
        document.getElementById("Download").style.display = "inline-block";
        document.getElementById("Characters_ch").style.display = "none";
        document.getElementById("Mv_ch").style.display = "none";
        document.getElementById("Download_ch").style.display = "none";
        document.getElementById("characters").style.display = "none";
        document.getElementById("download").style.display = "none";
        document.getElementById("mv").style.display = "none";
        document.getElementById("movies_watching").style.display = "none";
    }
    function change_characters_model() {
        document.getElementById("characters").style.display = "block";
        document.getElementById("Characters").style.display = "none";
        document.getElementById("Characters_ch").style.display = "inline-block";
        document.getElementById("Mv").style.display = "inline-block";
        document.getElementById("Story").style.display = "inline-block";
        document.getElementById("Download").style.display = "inline-block";
        document.getElementById("Mv_ch").style.display = "none";
        document.getElementById("Story_ch").style.display = "none";
        document.getElementById("Download_ch").style.display = "none";
        document.getElementById("story").style.display = "none";
        document.getElementById("download").style.display = "none";
        document.getElementById("mv").style.display = "none";
        document.getElementById("movies_watching").style.display = "none";
    }
    function change_download_model() {
        document.getElementById("download").style.display = "block";
        document.getElementById("Download").style.display = "none";
        document.getElementById("Download_ch").style.display = "inline-block";
        document.getElementById("Characters").style.display = "inline-block";
        document.getElementById("Story").style.display = "inline-block";
        document.getElementById("Mv").style.display = "inline-block";
        document.getElementById("Characters_ch").style.display = "none";
        document.getElementById("Story_ch").style.display = "none";
        document.getElementById("Mv_ch").style.display = "none";
        document.getElementById("story").style.display = "none";
        document.getElementById("characters").style.display = "none";
        document.getElementById("mv").style.display = "none";
        document.getElementById("movies_watching").style.display = "none";
    }
    function movie_watch() {
        document.getElementById("download").style.display = "none";
        document.getElementById("movies_watching").style.display = "block";
    }
    function play_video_1() {
        document.getElementById("video").src = "video/[FZSD][Koi_to_Senkyo_to_Chocolate][BDRip][01][BIG5][X264_AAC][720p].mp4";
    }
    function play_video_2() {
        document.getElementById("video").src = "video/[FZSD][Koi_to_Senkyo_to_Chocolate][BDRip][02][BIG5][X264_AAC][720p].mp4";
    }
    function play_video_3() {
        document.getElementById("video").src = "video/[FZSD][Koi_to_Senkyo_to_Chocolate][BDRip][03][BIG5][X264_AAC][720p].mp4";
    }
    function play_video_4() {
        document.getElementById("video").src = "video/[FZSD][Koi_to_Senkyo_to_Chocolate][BDRip][04][BIG5][X264_AAC][720p].mp4";
    }
    function play_video_5() {
        document.getElementById("video").src = "video/[FZSD][Koi_to_Senkyo_to_Chocolate][BDRip][05][BIG5][X264_AAC][720p].mp4";
    }
    function play_video_6() {
        document.getElementById("video").src = "video/[FZSD][Koi_to_Senkyo_to_Chocolate][BDRip][06][BIG5][X264_AAC][720p].mp4";
    }
    function play_video_7() {
        document.getElementById("video").src = "video/[FZSD][Koi_to_Senkyo_to_Chocolate][BDRip][07][BIG5][X264_AAC][720p].mp4";
    }
    function play_video_8() {
        document.getElementById("video").src = "video/[FZSD][Koi_to_Senkyo_to_Chocolate][BDRip][08][BIG5][X264_AAC][720p].mp4";
    }
    function play_video_9() {
        document.getElementById("video").src = "video/[FZSD][Koi_to_Senkyo_to_Chocolate][BDRip][09][BIG5][X264_AAC][720p].mp4";
    }
    function play_video_10() {
        document.getElementById("video").src = "video/[FZSD][Koi_to_Senkyo_to_Chocolate][BDRip][10][BIG5][X264_AAC][720p].mp4";
    }
    function play_video_11() {
        document.getElementById("video").src = "video/[FZSD][Koi_to_Senkyo_to_Chocolate][BDRip][11][BIG5][X264_AAC][720p].mp4";
    }
    function play_video_12() {
        document.getElementById("video").src = "video/[FZSD][Koi_to_Senkyo_to_Chocolate][BDRip][12][BIG5][X264_AAC][720p].mp4";
    }
    function play_video_13() {
        document.getElementById("video").src = "video/[FZSD][Koi_to_Senkyo_to_Chocolate][BDRip][13][BIG5][X264_AAC][720p].mp4";
    }
</script>